<template>
    <div class="main">
        <Header  title="终端销售单"></Header>
        <div class="Order">
            <operate :isAddShow='isAddShow' :isSeniorShow='isSeniorShow'></operate>
            <table cellspacing='0'>
                <tr>
                    <th>订单号</th>
                    <th>下单时间</th>
                    <th>会员手机</th>
                    <th>订单金额</th>
                    <th>门店名称</th>
                    <th>终端编码</th>
                    <th>收银人员</th>
                    <th>状态</th>
                    <th>---</th>
                </tr>
                <tr v-for="item in retailList" :key="item.id">
                    <td>{{item.order}}</td>
                    <td>{{item.orderTime}}</td>
                    <td>{{item.vipPhone}}</td>
                    <td>{{item.orderAmount}}</td>
                    <td>{{item.storesName}}</td>
                    <td>{{item.code}}</td>
                    <td>{{item.cash}}</td>
                    <td>{{item.state}}</td>
                    <td @click='goDetail'>详情</td>
                </tr>
                <tr>
                    <td colspan="9" style="border:0;color:#000">
                        <Footer></Footer>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</template>

<script>
import Header from "@/components/member/header"
import Footer from "@/components/member/footer"
import operate from "@/components/member/operate"
export default {
    name:'TerminalSalesO',
    data(){
        return {
            isAddShow:false,
            isSeniorShow:true,
            retailList:[],
        }
    },
    methods:{
        goDetail(){
            this.$router.push('/Retail/'+1)
        },
    },
    components:{
        Footer,
        Header,
        operate
    },
    created(){
        this.$http.post('http://120.76.56.2:3000/retail/terminalSales/get').then((res)=>{
            console.log(res)
            this.retailList = res.data
            this.$store.commit("common/setTotalNums",res.count);
            this.$store.commit("common/setTotalPages",res.pages);
        })
    },
    computed: {
        listData() {
            return this.$store.state.common.setCode;
        },
        listPage(){
            return this.$store.state.common.nowPage;
        }
    },
    watch:{
        listData(val) {
            this.$http.post('http://120.76.56.2:3000/retail/terminalSales/get',{
                code:this.$store.state.common.code
            }).then((res)=>{
                this.retailList = res.data
            })
        },
        listPage(page){
            this.$http.post('http://120.76.56.2:3000/retail/terminalSales/get',{
                page
            }).then((res)=>{
                this.retailList = res.data
            })
        }
    }
}
</script>

<style lang="scss" scoped>
.main {
	background-color: #f2f2f2;
	overflow: hidden;
	height: 100%;
}
.Order {
	font-family: "微软雅黑 Bold", "微软雅黑 Regular", "微软雅黑";
	margin: 0 auto;
	border-width: 0px;
	width: 1100px;
	height: 560px;
	background: inherit;
	background-color: rgba(255, 255, 255, 1);
	border: none;
	border-radius: 0px;
	box-shadow: none;
	overflow: hidden;
	margin-top: 10px;
	table {
		width: 1000px;
		margin: 0 auto;
		margin-top: 10px;
		tr {
			height: 40px;
			font-size: 12px;
			text-align: center;
			th {
				background-color: rgba(242, 242, 242, 1);
				box-sizing: border-box;
				border-width: 1px;
				border-style: solid;
				border-color: rgba(228, 228, 228, 1);
				border-bottom: 0px;
				font-weight: 400;
				font-size: 14px;
			}
			td {
				box-sizing: border-box;
				border-width: 1px;
				border-style: solid;
				border-color: rgba(228, 228, 228, 1);
				color: #666666;
				font-size: 12px;
				&:last-of-type {
					color: #0066ff;
					cursor: pointer;
					&:hover {
						text-decoration: underline;
					}
				}
			}
		}
	}
}
</style>
